import React, { useState } from "react";
import { addUser } from "../../services/user";
import {
  Modal,
  Button,
  Form,
  Radio,
  Input,
  message,
  Upload,
  Select,
} from "antd";
export default function Add({ show }) {
  const [isModalVisible, setIsModalVisible] = useState(false);
  const children = [];

  const handleChange = (value) => {
    console.log(`selected ${value}`);
  };

  const showModal = () => {
    setIsModalVisible(true);
  };

  const handleOk = async () => {
    let values = form.getFieldsValue();
    console.log(values);
if (values.username && values.pwd&&values.nickname&&values.address!=undefined) {
  await addUser(values);
  console.log("增加");
}else {
  Modal.error({
    title: '发生错误',
    content: '请填写用户信息！！！',
  });
}
    
    // console.log({...values,headImg:values.upload.file.response.filename});
    show();
    console.log("values", values);
    setIsModalVisible(false);
  };

  const handleCancel = () => {
    setIsModalVisible(false);
  };
  const [form] = Form.useForm();
  return (
    <>
      <Button type="primary" onClick={showModal}>
        增加用户
      </Button>
      <Modal
        title="增加学生"
        visible={isModalVisible}
        onOk={handleOk}
        onCancel={handleCancel}
      >
        <Form
          form={form}
          name="add"
          labelCol={{
            span: 8,
          }}
          wrapperCol={{
            span: 16,
          }}
          initialValues={{
            remember: true,
          }}
          autoComplete="off"
        >
          <Form.Item
            label="用户名"
            name="username"
            hasFeedback
            rules={[
              {
                required: true,
                message: "请输入用户名!",
              },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="密码"
            name="pwd"
            rules={[
              {
                required: true,
                message: "请输入密码!",
              },
            ]}
            hasFeedback
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="昵称"
            name="nickname"
            rules={[
              {
                required: true,
                message: "请输入昵称!",
              },
            ]}
            hasFeedback
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="管理员状态"
            name="privilege"
            rules={[
              {
                required: true,
                message: "请输入状态!(是/否)",
              },
            ]}
            hasFeedback
          >
            <Input />
          </Form.Item>
          <Form.Item label="地址" name="address">
            <Select
              mode="tags"
              style={{
                width: "100%",
              }}
              placeholder="Tags Mode"
              onChange={handleChange}
            >
              {children}
            </Select>
          </Form.Item>
        </Form>
      </Modal>
    </>
  );
}
